<style scoped>
  .expand-row{
    margin-bottom: 16px;
  }
  .lyx-table-btn{
    margin-right: 5px;
    margin-bottom: 2px;
  }
  .title-size {
    font-weight: bold;
    font-size: 1rem;
  }
  .red {
    color: #FF0000;
    display: inline-block;
  }
  .ivu-form-item-content {
    position: relative;
    line-height: 32px;
    font-size: 12px;
    display: flex;
  }
</style>
<template>
  <div>
      <Form label-position="right" :label-width="100" style="position: relative;" :model="formDate">
      <Row class="mb20">
        <Col span="13" class="ivu-form-item-label title-size">变更家庭信息</Col>
      </Row>
      <Row class="mb20">
        <Col span="8" class="ivu-form-item-label">申请人姓名：</Col>
        <Col span="9" offset="1" class="ivu-form-item-content">
          <Input v-model="formDate.applyPerson"></Input>
          <span class="red">*</span>
        </Col>
      </Row>
      <Row class="mb20">
        <Col span="8" class="ivu-form-item-label">申请人身份证号：</Col>
        <Col span="9" offset="1" class="ivu-form-item-content">
          <Input v-model="formDate.applyIdCard"></Input>
          <span class="red">*</span>
        </Col>
      </Row>
      <Row class="mb20">
        <Col span="13" class="ivu-form-item-label title-size">变更申请</Col>
      </Row>
      <Row class="mb20">
        <Col span="8" class="ivu-form-item-label">变更原因说明：</Col>
        <Col span="9" offset="1" class="ivu-form-item-content">
          <Input v-model="formDate.committeeChangeReason" type="textarea" :rows="4" placeholder="" />
          <span class="red">*</span>
        </Col>
      </Row>
      <Row class="">
        <Col span="8" class="ivu-form-item-label">请选择该家庭基本信息开始变化月份：</Col>
        <Col span="9" offset="1" class="ivu-form-item-content">
          <Select v-model="formDate.changeMonth" style="width:200px">
            <Option v-for="item in monthListaa" :value="item" :key="item"> {{item}}</Option>
          </Select>
        </Col>
      </Row>
      <Row class="mb20">
        <Col span="12" offset="9" class="ivu-form-item-label" style="text-align: left;color: red;">*下拉框为本季度该家庭资金发放月份，系统会保留变更月份之前的资金，等资金发放完毕后再将家庭信息返回社区。如果选择第一个月份，市级通过后立即返回。</Col>
      </Row>
      <Row class="mb20">
        <Col span="8" class="ivu-form-item-label">社区变更操作人：</Col>
        <Col span="9" offset="1" class="ivu-form-item-content">
          <Input v-model="formDate.committeeChangeHandler"></Input>
          <span class="red">*</span>
        </Col>
      </Row>
        <Row class="mb20">
          <Col span="8" class="ivu-form-item-label">申请地社区负责人：</Col>
          <Col span="9" offset="1" class="ivu-form-item-content">
            <Input v-model="formDate.committeePrincipal"></Input>
            <span class="red">*</span>
          </Col>
        </Row>
      <Row class="mb20">
        <Col span="13" class="ivu-form-item-label">
          <Button @click="save()">提交</Button>
        </Col>
      </Row>
    </Form>
  </div>
</template>
<script>
// import { itemParamByOrderList } from '@/api/eventlist'
export default {
  name: 'Form1',
  data () {
    return {
      bwk: '0',
      paramsArr: [],
      list: []
    }
  },
  props: {
    formDate: Object,
    ruleData: Object,
    monthListaa: {
      type: Array,
      default: () => {
        return []
      }
    }
  },
  mounted () {
  },
  watch: {
  },
  methods: {
    save () {
      // 判断必填字段是否为空
      console.log(this.formDate)
      if (!this.formDate.committeeChangeReason) {
        this.$Notice.error({ title: '请填写变更原因说明', desc: '' })
        return false
      } else if (!this.formDate.committeeChangeHandler) {
        this.$Notice.error({ title: '请填写社区变更操作人', desc: '' })
        return false
      } else if (!this.formDate.committeePrincipal) {
        this.$Notice.error({ title: '请填写申请地社区负责人', desc: '' })
        return false
      } else {
        this.$emit('ee')
      }
    }
  }
}
</script>
